<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>综合</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
</head>
<style>
.aui-tab-nav {
	background-color: #F3F3F3;
}
</style>
<body>
    <div class="aui-tab" id="aui-tab">
        <ul class="aui-tab-nav" id="aui-tab-nav">
            <li tapmode onclick="typeSwitch(this, 'news_list', 0)" data-frmname="news_list" class="active" id="type0">资讯</li>
            <li tapmode onclick="typeSwitch(this, 'news_hot', 1)" data-frmname="news_hot" id="type1">热点</li>
            <li tapmode onclick="typeSwitch(this, 'blog_list', 2)" data-frmname="blog_list" id="type2">博客</li>
            <li tapmode onclick="typeSwitch(this, 'blog_recommend_list', 3)" data-frmname="blog_recommend_list" id="type3">推荐</li>
        </ul>
    </div>
</body>
<script type="text/javascript" src="../script/api.js" ></script>
<script type="text/javascript" src="../script/zepto.min.js"></script>
<script type="text/javascript" src="../script/common.js" ></script>
<script type="text/javascript">
	var nowTabIndex = 0;

    apiready = function () {
    	var pageParam = api.pageParam;
    	
		var auiTab = $api.byId('aui-tab');
		var auiTabPos = $api.offset(auiTab);
		var body_h = api.winHeight - pageParam.headerHeight - pageParam.footerHeight;

		api.openFrameGroup ({
            name: 'tab_0',
            scrollEnabled:true,
            rect:{
				x:0,             //左上角x坐标
				y:pageParam.headerHeight + auiTabPos.h,             //左上角y坐标
				w:'auto',           //宽度，若传'auto'，页面从x位置开始自动充满父页面宽度
				h:body_h - auiTabPos.h,          //高度，若传'auto'，页面从y位置开始自动充满父页面高度
			},
            index:0,
            preload:1,
            frames:
            [{
                name: 'news_list', 
                url: './news_list.html', 
                bounces:true,
                scrollToTop:false
            },{
                name: 'news_hot', 
                url: './news_hot.html', 
                bounces:true,
                scrollToTop:false
            },{
                name: 'blog_list', 
                url: './blog_list.html', 
                bounces:true,
                scrollToTop:false
            },{
                name: 'blog_recommend_list', 
                url: './blog_recommend_list.html', 
                bounces:true,
                scrollToTop:false
            }]
        }, function(ret, err){
	        var aui_tab_nav = $api.byId('aui-tab-nav');
	        var aui_tab_nav_act = $api.dom(aui_tab_nav, '.aui-tab-nav li.active');
	        $api.removeCls(aui_tab_nav_act, 'active');
	        
            var name = ret.name;
            var index = ret.index;
            
            nowTabIndex = index;
            
			$api.addCls($api.byId('type'+index), 'active');
			
	        // iOS点击状态栏可返回顶部
			$("ul li").each(function(index){
				var frmname = $(this).data("frmname");
				api.setFrameAttr({
				    name: frmname,
				    scrollToTop: false
				});
			});
			api.setFrameAttr({
			    name: name,
			    scrollToTop: true
			});
        });
		
		
    }
    
    function typeSwitch(obj, name, index){
    
    	// 点击选项卡返回顶部
    	if(index == nowTabIndex){
			api.execScript({
			    name: 'root',
			    frameName: name,
			    script: 'scroll();'
			});
    	}
    
        var aui_tab_nav = $api.byId('aui-tab-nav');
        var aui_tab_nav_act = $api.dom(aui_tab_nav, '.aui-tab-nav li.active');
        $api.removeCls(aui_tab_nav_act, 'active');
        $api.addCls(obj, 'active');
        api.setFrameGroupIndex({
            name: 'tab_0',
            index: index
        });
        
        // iOS点击状态栏可返回顶部
		$("ul li").each(function(index){
			var frmname = $(this).data("frmname");
			api.setFrameAttr({
			    name: frmname,
			    scrollToTop: false
			});
		});
		api.setFrameAttr({
		    name: name,
		    scrollToTop: true
		});
    }
    
    
</script>
</html>